<!DOCTYPE html>
<html lang="en">
<head>
  <meta charset="UTF-8">
  <meta http-equiv="X-UA-Compatible" content="IE=edge">
  <meta name="viewport" content="width=device-width, initial-scale=1.0">
  <title>Document</title>
  <script>
    let btn = document.getElementById('btn');
    if (btn) {
        btn.onclick = function () {
            console.log('haha');
        }
    }
</script>
</head>
<body>
  
  <button id="btn">click me</button>

  <script>
    // 数学运算符：+ - * / %
    // let a = 5;
    // let b = 4;
    // console.log(a + b);
    // console.log(a - b);
    // console.log(a * b);

    //赋值运算符： = += -= *= /= %=      赋值运算自右向左
    // let a = 5;
    // a += 6; //a = a + 6;
    // console.log(a);

    // let a = 5;
    // let b = 0;
    // b += a; //b = b + a;
    // console.log(b);

    //自增自减运算符： ++ --
    // 前自增：a++，先参与运算，a再加1
    // 后自增：++a，a先加1，再参与运算

    // let a = 5;
    // a++;//后自增
    // console.log(a);

    // let a = 5;
    // let b = ++a;//前自增
    // console.log( a, b );

    // let a = 5;
    // let b = (a++) + 6; // ++运算优先级比+高
    // console.log(b);

    //比较运算符：== > < >= <= != === !==
    // console.log(2 == 3); // => false
    // console.log(2 > 3); // => false
    // console.log(2 < 3); // => true
    // console.log(2 >= 3); // => false
    // console.log(2 <= 3); // => true
    // console.log(2 != 3); // => false
    // console.log(2 === 3); // => false  ===全等/恒等，不仅比较值是否相等，还比较数据类型
    // console.log(2 == "2"); // =>true,字符串的“2”会隐式转换成数字2，再进行比较
    // console.log(2 === "2"); // => false,全等不会隐式转换

    //逻辑运算符：&&（且） ||（或） ！（非）
    // &&:读作and，逻辑与，也叫并且,要求and两边的比较运算全都返回true，整个结果才为true
    // if (2 < 3 && 4 == 5){
    //   console.log(true); // false
    // }

    // ||:逻辑或,只要||两边的比较运算有一个返回true，整个结果就为true
    // if(2 < 3 ||4 == 5){
    //   console.log(true);
    // }
  
    // 逻辑与和逻辑或都会短路运算
    // if(2 > 3 && 4 == 4){
    //   console.log(true);// 短路运算
    // }

    // if(2 > 3 && 5 / 0 == 0){
    //   console.log("haha");
    // }

    // !取反 ：非0的数字，非“”空的字符串相当于true，其他相当于false
    // let a = 5;       // => false
    // let b = "abc";// => false
    // let c = 0;    // => true
    // let d = "";   // => true
    // let e = " ";  // => false
    // let f;        // => true
    // let g = null; // => true
    // console.log(!g);
  
  // 例子
    // let a = 5;
    // if(a = 6){
    //   console.log('yes');// 会打印yes，因为a=6，是赋值运算，相当于if（6），结果为true
    // }

    // let a = 5;
    // if(a){
    //   console.log('yes');// 会打印yes
    // }

    // let a = 5;
    // let b ="6";
    // console.log(a + b);//此时+不是数学加法，而是字符串的链接符 =>"5"+"6"="56",这里发生了隐式类型转换

    // let a = "5";
    // let b = true;
    // console.log(a + b);//"5true"

    // let a = 5;
    // let b = true;
    // console.log(a + b);// => 6,true 隐式转换为1

    // let a = "5";
    // let b ;
    // console.log(a + b);//"5undefined"

    // let a = 5;
    // let b = null;
    // console.log(a + b);// “5null”

    // let a = "6";
    // let b = 5;
    // console.log( a - b);
    // console.log( a * b);
    // console.log( a / b);
    // console.log( a % b);

  // 总结：
  // 1.任何其他数据类型与字符串进行【+】，结果都是该数据类型隐式转换为相应的字符串，再进行字符串的拼接
  // 2. -、*、/、%，全都是数学运算，但是 + 分为几种情况：
  // 2.1）a + b：如果a和b都是非字符串类型，那么结果就是数学的加法
  // 2.2）a + b：如果a和b中有一个或多个字符串，那么结果就是字符串的拼接

    // 类型运算符
    // typeof:用来测试变量的数据类型，它既是运算符，也是函数
    // let a = 5;
    // let b = "abc";
    // let c = true;
    // let d;
    // let e = null;
    // console.log(typeof a);// "number"
    // console.log(typeof b);// "string"
    // console.log(typeof c);// "boolean"
    // console.log(typeof d);// "undefined"
    // console.log(typeof e);// "object"

    // console.log( typeof(typeof a) ); //"string"
    // console.log( typeof(xxx) ); 

  </script>
</body>
</html>